* {
  margin: 0;
  padding: 0;
  font-style: normal;
  list-style: none;
}
body {
  background-color: #ccc;
}
/* Logo 字体 */
@font-face {
  font-family: 'iconfont';
  src: url('../iconfont/.eot?t=1587896897240');
  /* IE9 */
  src: url('../iconfont/.eot?t=1587896897240#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAN8AAsAAAAAB/AAAAMuAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDKgqDDIJEATYCJAMUCwwABCAFhG0HVBvUBhEVnBPIvhqw22LA6oS+4fMs88PSh5dSpIbiFsqZbGZm1gio/X578j6HaRNL8BPeRCuJkEiiiegZUiMkhpAIRaNYyFyN+98nNzfY2d9IhFKgp0PtwE12BN1shlpFGdwOGhCGGeXz3fw3qLGeZ5aFgYytFN4AXc9bRvFtrVkJVKfCRFUeydonj/JnFrJ0kJ1crmDcHxwzXoJO89Y2t6iiLo8GnODAooNsD9LC9A/xapd22OsJaDKgLqxG2w5FRrsFhL2atUdJOWSZDxdBrWRsJtyCoMSn9zNw4398+JkZIyOqEnSjzcpmwuIf9j+xvtBHPq4ffeOZwU8ioY5M2Cm1bkMKA3VJk7pYNo+iiLyzv9N/bQiIpVz6T15QNGlClkSBUANSW8AiCWbeqc2NZQwlfFmJLCIfB/8+1qpAEwp2gDNUPsbIoknTUeBwVw3upB4ZwJ9ZCe3UCwgbrjSN4+LX90vv2zt4Y1Z0oviETS2jHUsefk3keX2hWIewgxFPSCtPdgSrnaVycavobCsulRsY8hgvm5RUHG9zl3RlNt+eUID4wj3fnJCCDsIPvC+kor3w9DmZjbHVi7mFyWrfG3Y81tI6RIqTUMa//7/vWNc3xn3l6JitH2zBCU8zeRbD1Hy0aXgK8H9nC7Nh6z4/LfsBpFv6BfYb+vGzPsf90V9WxHL/hRbg6RoMoOO/L9CP+8Z5rXm/hteyLGsCqquykmlzFXtlZAR75E8IfkmELm/jKHtv2ByUFI+HqEE/JMUYImPqUGk2DTXFAjSZsDG5WbcTSEJeGHcNEHS4g6jNAyQdHhEZ8wqVPn9Q0xEOmhh+O895dCkeXhiVoAX9hGhocJZBDkH6J/qpU5wU+Phf5DG6oS6qbPgDB+QxBow334g4cEw9vMNm2HUEmSmhkSKI5GtZurIXFYb62cELhhSBLKA9gcggA+fWFofc+z8hb9JRuCaryv4LsVGsH9QKVQvEh3RolXUtl4xuvIYQDnAY6YF3MKPODBCQy1slyBCF0MOXXZWkmmsrLeaX9w+Qw+dBBxEqWVFr2J66kOjBbzQ55ZmPY2BVz4hJNO0fUYWa2QwAAA==') format('woff2'), url('../iconfont/.woff?t=1587896897240') format('woff'), url('../iconfont/.ttf?t=1587896897240') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('../iconfont/.svg?t=1587896897240#iconfont') format('svg');
  /* iOS 4.1- */
}
.wraper {
  padding-top: 20px;
  width: 300px;
  height: 500px;
  margin: 100px auto;
  background: url(../images/bg.jpg) center;
}
.wraper .rotate_box {
  margin: 0 auto;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  background: url(../images/样式.png);
  animation: rotate linear 10s infinite;
}
.wraper .rotate_box .inner {
  position: relative;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 100px;
  height: 100px;
  background-color: #f30;
  border-radius: 50%;
}
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.wraper .music {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 10px auto 0;
  width: 230px;
  height: 50px;
}
.wraper .music div {
  display: inline-block;
  font-family: 'iconfont';
  font-size: 25px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.wraper .music div.current_timer {
  font-size: 15px;
  width: 50px;
}
.wraper .music div.all_timer {
  font-size: 15px;
  width: 50px;
}
.wraper .irc {
  width: 298px;
  height: 188px;
  margin: 0 auto;
  background-color: #ccc;
}
.wraper .irc textarea {
  width: 100%;
  height: 100%;
  outline: none;
  resize: none;
  border: none;
  background-color: transparent;
}
